<template>
	<view>
		<u-sticky>
			<view class="tabs">
				<u-tabs @click="click" :list="tablist" keyName="name" :current="current" lineWidth="30"
					lineColor="#f56c6c" :activeStyle="{
						color: '#303133',
						fontWeight: 'bold',
						transform: 'scale(1.1)'
					}" :inactiveStyle="{
						color: '#606266',
						transform: 'scale(1)'
					}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;">
				</u-tabs>
			</view>
		</u-sticky>
		<view class="content">
			<view class="list">
				<view class="title">
					路费设置
				</view>
				<view class="con1">
					<view class="text">
						起始前 <input type="digit" class="input" v-model="model.starting" confirm-type="done" @confirm="submit"/> 公里 <input type="digit"
							v-model="model.startingprice" class="input" @blur="submit" confirm-type="done" @confirm="submit"/> 元
					</view>
					<view class="text">
						每超过 <input type="digit" class="input" v-model="model.every"  confirm-type="done" @confirm="submit"/> 公里 <input type="digit"
							class="input" v-model="model.everyprice" @blur="submit" confirm-type="done" @confirm="submit"/> 元
					</view>
				</view>
			</view>
			<view class="list">
				<view class="title">
					活动设置
				</view>
				<view class="con1">
					<view class="text1">
						<view>
							每期服务费
						</view>
						<view class="input1">
							<u-input type="digit" inputAlign="right" border="none" placeholder="请输入"
								v-model="model.activity_price" confirm-type="done" @blur="submit" @confirm="submit"></u-input>
							<span>元</span>
						</view>
					</view>
					<view class="text1">
						<view>
							每期天数
						</view>
						<view class="input1">
							<u-input type="number" inputAlign="right" border="none" placeholder="请输入"
								v-model="model.activity_num" confirm-type="done" @blur="submit" @confirm="submit"></u-input>
							<span>天</span>
						</view>
					</view>
				</view>
			</view>
			<view class="list">
				<view class="title" @click="servicePage">
					服务设置
					<u-icon name="arrow-right" size="14" color="#333333"></u-icon>
				</view>				
			</view>
			<view class="list">
				<view class="title" @click="goPage('quan')">
					代金券设置
					<u-icon name="arrow-right" size="14" color="#333333"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			tablist: [],
			model: {},
			current: 0,
			page: 1,
			serviceList: [],
			city_id: null
		};
	},
	onLoad() {
		this.rq.getData('agent/city_classify').then(res => {
			this.tablist = res.data.city
			this.click({ id: res.data.city[0].id })
		})		
	},
	methods: {
		// 获取服务列表
		getService(more) {
			this.rq.getData('Service/index', { page: this.page }).then(res => {
				if (more) {
					this.serviceList = this.serviceList.concat(res.data.data)
				} else {
					this.serviceList = res.data.data
				}
			})
		},
		submit(){
			this.rq.getData('Agency_Config/save',this.model).then(res=>{}).catch((err)=>{
				console.log(err)
			})
		},
		// 城市切换
		click(e) {
			this.city_id = e.id
			this.rq.getData('Agency_Config/index', { city_id: e.id }).then(res => {
				this.model = res.data
				this.model.city_id = e.id
			})
		},
		// 服务开关
		setServiceChange(item) {
			this.rq.getData('Service_Area/open', { id: item.id, is_open: item.is_open == 1 ? 0 : 1, city_id: this.city_id }).then(res => {
				this.getService()
			})
		},
		// 跳转
		goPage(url, id) {
			if (url == 'service') {
				uni.navigateTo({
					url: `/subpages/proxyManage/${url}?id=${JSON.stringify(id)}&city_id=${this.city_id}`
				})
			} else {
				uni.navigateTo({
					url: `/subpages/proxyManage/${url}?city_id=${this.city_id}`
				})
			}

		},
		servicePage(){
			uni.navigateTo({
				url: `/subpages/proxyManage/serviceList?city_id=${this.city_id}`
			})
		},
	}
}
</script>

<style lang="scss">
.content {
	margin-top: 20rpx;
	width: 100%;

	.list {
		width: 84%;
		margin: 20rpx auto;
		padding: 30rpx;
		border-radius: 8px;
		opacity: 1;
		background: #FFFFFF;

		.title {
			font-family: PingFang SC;
			font-size: 14px;
			font-weight: normal;
			line-height: 14px;
			letter-spacing: 0px;
			color: #333333;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.con1 {
			margin: 20rpx 0;

			.item {
				padding-top: 20rpx;
				display: flex;
				align-items: center;

				.left {

					.icon-image {
						width: 66rpx;
						height: 66rpx;
					}
				}

				.right {
					width: 100%;
					margin-left: 20rpx;

					.r1 {
						display: flex;
						align-items: center;
						justify-content: space-between;
						height: 50rpx;

						.name {
							font-family: 阿里巴巴普惠体 2.0;
							font-size: 14px;
							font-weight: normal;
							line-height: 16px;
							letter-spacing: 0px;

							color: #333333;
						}

						.btn {
							display: flex;
							align-items: center;

							.btn1 {
								width: 26rpx;
								height: 26rpx;
							}
						}
					}

					.r2 {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.text {
							font-family: 阿里巴巴普惠体;
							font-size: 12px;
							font-weight: normal;
							line-height: 12px;
							letter-spacing: 0px;

							color: #999999;

							.num {
								font-family: 阿里巴巴普惠体;
								font-size: 12px;
								font-weight: normal;
								line-height: 12px;
								letter-spacing: 0px;

								color: #FF7681;
							}
						}
					}
				}
			}

			.text1 {
				font-family: PingFang SC;
				font-size: 14px;
				font-weight: normal;
				line-height: 14px;
				letter-spacing: 0px;
				color: #666666;
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin: 20rpx 0;

				.input1 {
					display: flex;
					align-items: center;

					span {
						margin-left: 20rpx;
						color: #333333;
					}
				}
			}

			.text {
				font-family: PingFang SC;
				font-size: 14px;
				font-weight: normal;
				line-height: 14px;
				letter-spacing: 0px;
				color: #666666;
				display: flex;
				align-items: center;
				margin: 20rpx 0;

				.input {
					width: 17.95%;
					height: 21.82%;
					border-radius: 4px;
					opacity: 1;
					background: #F1F1F1;
					margin: 0 20rpx;
					text-align: center;

				}
			}
		}
	}
}

.tabs {
	background-color: #ffffff;
	padding: 10rpx 0;
}
</style>